<!DOCTYPE html>
<html >
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,minimal-ui">
    <meta name="format-detection"content="telephone=yes"/>
    <meta http-equiv="Cache-Control" content="no-cache"/>
    <meta http-equiv="Cache-Control" content="max-age=0"/>
    <meta http-equiv="Pragma" content="no-cache"/>
    <meta http-equiv="Expires" content="0"/>
    <title></title>
    <style>
        /*阻止IOS微信回弹*/
        html,body{
            width: 100%; height: 100%; position: fixed;top:0;left:0;
            overflow:auto;
        }
    </style>
  </head>
  <body>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
  <script>
    var maxWidth = 640
    var styleEl = document.createElement('style');
    styleEl.setAttribute('type', 'text/css');
    styleEl.id = 'HTML_ROOT_STYLE';
    styleEl.innerHTML = 'html{font-size:'+ (document.documentElement.clientWidth >= maxWidth ? maxWidth : document.documentElement.clientWidth) / 10 + 'px!important;}';
    if (document.querySelector('#HTML_ROOT_STYLE') != null) {
        document.querySelector('#HTML_ROOT_STYLE').remove();
    }
    document.getElementsByTagName('head').item(0).appendChild(styleEl);
    var isAndroid = window.navigator.appVersion.match(/android/gi)
    var isIPhone = window.navigator.appVersion.match(/iphone/gi)
    var devicePixelRatio = window.devicePixelRatio
    var deviceWidth = document.documentElement.clientWidth
    var dpr;
    if (isIPhone) {
        if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
            dpr = 3;
        } else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)) {
            dpr = 2;
        } else {
            dpr = 1;
        }
    }
    if (isAndroid) {
        if (deviceWidth >= 414) {
            dpr = 3;
        } else {
            dpr = 2;
        }
    }
    document.documentElement.setAttribute('data-dpr', dpr);
  </script>
</html>
